<template>
<view class="container padding">
	<view class="shim"></view>
	<!-- 个人信息 -->
	<view class="profile-banner padding-all box-shadow">
		<view class="profile-banner-avatar border-circle border-radius">
			<image class="profile-banner-cover border-radius"
				src="/static/v2_qb8b4c.png"
				mode="aspectFill" />
			<view class="profile-banner-text">旋风小子</view>
		</view>
		<uni-grid class="sec-top"
			:column="3"
			:showBorder="false"
			:square="false">
			<uni-grid-item>
				<view class="profile-item">
					<view class="profile-item-stat">
						<text class="iconfont middle">15</text>天
					</view>
					<view class="profile-item-text">坚持学习</view>
				</view>
			</uni-grid-item>
			<uni-grid-item>
				<view class="profile-item">
					<view class="profile-item-stat">
						<text class="iconfont middle">10</text>小时
					</view>
					<view class="profile-item-text">累计学习</view>
				</view>
			</uni-grid-item>
			<uni-grid-item>
				<view class="profile-item">
					<view class="profile-item-stat">
						<text class="iconfont middle">5</text>门
					</view>
					<view class="profile-item-text">参与课程</view>
				</view>
			</uni-grid-item>
		</uni-grid>
	</view>
	<!-- 课表/资料/练习/报告 -->
	<view class="profile-banner padding-all box-shadow sec-top">
		<uni-grid :column="4"
			:showBorder="false"
			:square="false">
			<uni-grid-item>
				<view class="profile-item">
					<view class="profile-item-stat">
						<text class="iconfont icon-table large"></text>
					</view>
					<view class="profile-item-text">课表</view>
				</view>
			</uni-grid-item>
			<uni-grid-item>
				<view class="profile-item">
					<view class="profile-item-stat">
						<text class="iconfont icon-market large"></text>
					</view>
					<view class="profile-item-text">资料</view>
				</view>
			</uni-grid-item>
			<uni-grid-item>
				<view class="profile-item">
					<view class="profile-item-stat">
						<text class="iconfont icon-practice large"></text>
					</view>
					<view class="profile-item-text">练习</view>
				</view>
			</uni-grid-item>
			<uni-grid-item>
				<view class="profile-item">
					<view class="profile-item-stat">
						<text class="iconfont icon-notice large"></text>
					</view>
					<view class="profile-item-text">报告</view>
				</view>
			</uni-grid-item>
		</uni-grid>
	</view>
	<!-- 我的云盘 -->
	<view class="profile-banner padding-all box-shadow sec-top">
		<uni-grid :column="2"
			:showBorder="false"
			:square="false">
			<uni-grid-item>
				<view class="profile-item-v">
					<text class="iconfont icon-cloud large"></text>
					<view class="profile-item-text sec-left">
						<view>我的云盘</view>
						<view class="text-primary">总量: 199G</view>
					</view>
				</view>
			</uni-grid-item>
			<uni-grid-item class="border-left">
				<view class="profile-item-v">
					<slider style="flex: 1;"
						value="50"
						activeColor="#007AFF"
						backgroundColor="#EEEEEE"
						block-color="#FFFFFF"
						block-size="12" />
					<view class="profile-item-text sec-left">
						<view>已使用</view>
						<view class="text-primary">99G</view>
					</view>
				</view>
			</uni-grid-item>
		</uni-grid>
	</view>
	<!-- 我的门禁卡 -->
	<view class="profile-banner sec-top">
		<view class="resource-item padding">
			<view class="resource-item-text">
				<text>我的门禁卡</text>
				<!-- #ifdef APP-PLUS -->
				<text class="iconfont icon-scan middle"
					@click="onScan({ id: 1})"></text>
				<!-- #endif -->
			</view>
			<view class="resource-item-container"
				@click="onItemClick('sign', { id: 1 })">
				<image class="resource-item-cover"
					src="/static/banner.png"
					mode="aspectFill" />
				<view class="resource-item-mask--text">
					4月26日 19:00 直播
				</view>
			</view>
			<view class="resource-item-footer">
				<text>计算机原理与操作系统</text>
			</view>
		</view>
	</view>
	<!-- 电子班牌 -->
	<view class="profile-banner sec-top">
		<view class="resource-item padding">
			<view class="resource-item-text">
				<text>电子班牌</text>
				<!-- #ifdef APP-PLUS -->
				<text class="iconfont icon-scan middle"
					@click="onScan({ id: 1})"></text>
				<!-- #endif -->
			</view>
			<view class="resource-item-container"
				@click="onItemClick('sign', { id: 1 })">
				<image class="resource-item-cover"
					src="/static/banner.png"
					mode="aspectFill" />
				<view class="resource-item-mask--text">
					4月26日 19:00 直播
				</view>
			</view>
			<view class="resource-item-footer">
				<text>计算机原理与操作系统</text>
			</view>
		</view>
	</view>
	<!-- 其他 -->
	<view class="profile-banner sec-top">
		<view class="task-list">
			<view class="task-item border"
				@click="onTaskItem('rank')">
				<view class="task-item-content">
					<text class="iconfont icon-phb"></text>
					<text class="sec-left">班级排行</text>
				</view>
				<view class="task-item-action">
					<uni-icons type="arrowright" size="16" color="#999999" />
				</view>
			</view>
			<view class="task-item border"
				@click="onTaskItem('message')">
				<view class="task-item-content">
					<text class="iconfont icon-comment"></text>
					<text class="sec-left">我的通知</text>
				</view>
				<view class="task-item-action">
					<uni-icons type="arrowright" size="16" color="#999999" />
				</view>
			</view>
			<view class="task-item"
				@click="onTaskItem('setting')">
				<view class="task-item-content">
					<text class="iconfont icon-setting"></text>
					<text class="sec-left">设置</text>
				</view>
				<view class="task-item-action">
					<uni-icons type="arrowright" size="16" color="#999999" />
				</view>
			</view>
		</view>
	</view>
	<view class="shim-small"></view>
</view>
</template>

<script>
export default {
	data() {
		return {
			
		}
	},
	onShow() {
		const token = uni.getStorageSync('X-Auth-Token');
		if (!token) {
			uni.navigateTo({
				url: '/pages/login/login'
			});
		}
	},
	methods: {
		onTaskItem(type) {
			switch(type) {
				case 'rank':
					uni.navigateTo({
						url: `/pages/profile/${ type }?from=profile`
					});
					break;
				case 'message':
					uni.navigateTo({
						url: `/pages/message/${ type }?from=profile`
					});
					break;
				default:
					uni.navigateTo({
						url: `/pages/setting/${ type }?from=profile`
					});
					break;
			}
		},
		onItemClick(type, item) {
			uni.navigateTo({
				url: `/pages/${ type }/detail?id=${ item.id }&from=task`
			})
		},
		onScan(item) {
			// #ifdef APP-PLUS
			uni.scanCode({
				success(res) {
					console.log('scan success: ', res)
				},
				complete() {
					console.log('scan complete')
				}
			});
			// #endif
		}
	}
}
</script>
